<template>
  <view class="page">
    <view class="notice-meta">
      <image class="icon" src="/static/images/icon_notice.png" mode=""></image>
      {{noticeData.categoryName}}
    </view>
    <view class="notice-title">{{noticeData.title}}</view>
    <view class="notice-desc">{{noticeData.releaseTime}}</view>
    <view class="notice-content">
      <rich-text :nodes="noticeData.content"></rich-text>
    </view>
  </view>
</template>
<script>
  /**
   * Copyright (c) 2013-Now http://aidex.vip All rights reserved.
   */
  export default {
    data() {
      return {
        noticeData: {
          title: "",
          categoryName: "",
          releaseTime: null,
          content: "",
          createUser: null,
          createDept: null
        },
        noticeList: []
      };
    },
    onLoad(params) {
      this.getDetail(params.id);
    },
    methods: {
      navTo(url) {
        uni.navigateTo({
          url: url
        });
      },
      getDetail(id) {
        let params = {}
        params.id = id;
        this.$u.api.notice.detail(params).then(res => {
          this.noticeData = res.data;
        })
      },
    }
  };
</script>
<style lang="scss">
  .page {
    height: 100vh;
    padding: 40rpx;
    background-color: #fff;
  }

  .notice-meta {
    display: flex;
    align-items: center;
    font-size: 24rpx;
    font-weight: 500;
    color: #999;
    
    .icon {
      width: 34rpx;
      height: 34rpx;
      margin-right: 16rpx;
    }
  }
  
  .notice-title {
    margin-top: 48rpx;
    margin-bottom: 24rpx;
    font-size: 48rpx;
    font-weight: 700;
    color: #000;
  }
  
  .notice-desc {
    color: #ccc;
  }
  
  .notice-content {
    margin-top: 48rpx;
    line-height: 46rpx;
    font-size: 28rpx;
    font-weight: 500;
    color: #333;
  }
</style>